<!--
 * @Author: your name
 * @Date: 2021-08-12 14:07:55
 * @LastEditTime: 2021-08-27 16:59:16
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \doctor\src\components\content\doctorTeam\Pagination.vue
-->
<template>
  <div id="pagination">
    <el-container>
      <el-main class="search-content-box">
        <div class="block">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-sizes="[5, 10, 15, 20]"
            :page-size="5"
            layout="total, sizes, prev, pager, next, jumper"
            :total="totalCount"
          >
          </el-pagination>
        </div>
      </el-main>
    </el-container>
  </div>
</template>

<script>
import bus from '../../EventBus.js'
export default {
  data() {
    return {
      currentPage: 1, //前往多少页
      nowPage: 1, //当前页
      pageCount: 5 //当前页数据条数
    }
  },
  props: {
    totalCount: {
      //从父级接收，总数据条数
      default: 0,
      type: Number
    }
  },
  methods: {
    toOne(){
      this.currentPage=1
      console.log(this.currentPage)
    },
    //获取每页显示数据条数函数
    handleSizeChange(val) {
      this.pageCount = val
      console.log('每页显示数据条数：', this.pageCount)
      this.$emit('shareData', {
        nowPage: this.nowPage,
        pageCount: this.pageCount
      }) //发送更新后的页数
    },
     //当前点击页函数
    handleCurrentChange(val) {
      this.nowPage = val;

      console.log("当前点击页：", this.pageCount);
      this.$emit("shareData", {
        nowPage: this.nowPage,
        pageCount: this.pageCount,
      });
    }
  }
}
</script>

<style lang="less" scoped>
#pagination {
  margin: 0 1rem 1rem;
  background-color: #f5f9fc;
}
.block {
  text-align: center;
}
</style>
